// http://ionicframework.com/docs/theming/
// App Global Sass
// --------------------------------------------------
// Put style rules here that you want to apply globally. These
// styles are for the entire app and not just one component.
// Additionally, this file can be also used as an entry point
// to import other Sass files to be included in the output CSS.
//
// Shared Sass variables, which can be used to adjust Ionic's
// default Sass variables, belong in "theme/variables.scss".
//
// To declare rules for a specific mode, create a child rule
// for the .md, .ios, or .wp mode classes. The mode class is
// automatically applied to the <body> element in the app.
.logo {
  padding-top: 5%;
  max-width: 95px;
  margin: auto;
}

.topSLogan {
  margin-top: 0%;
  text-align: center;
  margin-bottom: 0%;
}

.login {
  background-color: #1d5288;
}

.topSLogan p {
  color: #82b1ff;
  text-align: center;
  font-style: italic;
}

.bottomSLogan {
  text-align: center;
  margin-bottom: 2%;
  margin-top: 0px;
}

.bottomSLogan p {
  margin: 0px;
}

.bottom-sLogan-title {
  font-style: italic;
  color: #ffffff;
  text-transform: lowercase;
  font-size: 0.8rem;
}

//button for ios
.button-ios,
.button-md {
  margin: 0em;
  padding: 0em
}

ion-modal.inset-modal {
  background-color: rgba(0, 0, 0, 0.5) !important;
  transition: opacity 0.25s ease-in-out;
  padding: 20vh 7vw;
}

.app-item-container {
  min-width: 105px;
  max-width: 120px;
}

.apps-contents {
  border: 0.5px solid #e6e6e7;
  border-radius: 1rem;
  padding: 5px 16px 5px;
}

.menu-app-icon-list {
  width: 55%;
  text-align: center;
  margin: auto;
}

.menu-app {
  text-align: center;
  font-size: 1.2rem;
  white-space: nowrap;
  overflow: hidden !important;
  text-overflow: ellipsis;
}

.required {
  color: #f53d3d;
}

.logo-inside-app {
  max-width: 15%;
  margin: auto;
}

.side-menu-icon {
  width: 1.5rem;
  height: 1.5rem;
}

.tracker-pagination-icon {
  width: 1.2rem;
  height: 1.2rem;
}

.footer-icon {
  width: 2rem;
  height: 2rem;
}

.dashboard-item-icon {
  padding-top: 0.3rem;
  padding-right: 0.2rem;
  width: 1.8rem;
  height: 1.8rem;
}

.dashboard-border,
.dashboard-btn {
  -webkit-box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.3);
  -moz-box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.3);
  box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.3);
}

.dashboard-btn {
  border-style: none;
  cursor: pointer;
  background-color: rgba(255, 255, 255, 0.5);
  height: 30px;
  padding: 3px;
  margin-left: 2px;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  -webkit-transition: all 0.2s ease-in-out;
  -moz-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  -ms-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
}

.dashboard-btn:hover {
  background-color: rgba(241, 241, 241, 0.6);
  -webkit-transform: scale(1.1);
  -moz-transform: scale(1.1);
  -o-transform: scale(1.1);
  -ms-transform: scale(1.1);
  transform: scale(1.1);
}

.empty-space-padding {
  margin-top: 2rem;
}

.entry-selection-container {
  border: 1px solid #e6e6e7;
  border-radius: 0.7rem;
  padding: 5px 10px 5px;
}

.entry-selection {
  padding-top: 1.3rem;
  padding-bottom: 1.3rem;
}

.item-car-tracker-details-sections {
  border: 1px solid #e6e6e7;
  border-radius: 0.1rem;
  padding: 5px 2px 5px;
  margin-top: 2px;
  margin-bottom: 2px;
}

.item-card {
  border: 1px solid #e6e6e7;
  background-color: #FFFFFF;
  border-radius: 0.2rem;
  padding: 5px 10px 5px;
  margin-top: 5px;
  margin-bottom: 5px;
}

.icon-color {
  color: #97cbfd;
}

//fields color
.grey-field {
  background-color: #f4f4f4;
}

.program-stage-button-label {
  border-radius: 50%;
  border: 1px solid #97cbfd;
  text-align: center;
  padding: 0.5rem 0.8rem;
}

.program-stage-button-label-active {
  border-radius: 50%;
  border: 1px solid #b9ffb9;
  text-align: center;
  padding: 0.5rem 0.8rem;
  margin: auto;
}

.item-card-with-no-margin {
  border: 1px solid #e6e6e7;
  border-radius: 0rem;
  padding: 5px 10px 5px;
  margin: 0px;
}

.item-card-program-stage-section {
  border: 1px solid #e6e6e7;
  border-radius: 0.3rem;
  padding: 5px 10px 5px;
  background-color: #f4f4f4;
  margin-top: 5px;
  margin-bottom: 5px;
}

.item-card-category {
  border: 1px solid #e6e6e7;
  border-radius: 0.3rem;
  padding: 5px 1px 5px;
  margin-top: 5px;
  margin-bottom: 5px;
}

.over-flow-container {
  overflow-x: auto;
}

.round-button {
  border-radius: 64px;
  padding-left: 2rem;
  padding-right: 2rem;
}

.item-card-entry-form {
  border: 1px solid #e6e6e7;
  border-radius: 0.3rem;
  padding: 5px 2px 5px 5px;
  margin-top: 5px;
  margin-bottom: 5px;
}

.input-field-container {
  border: 1px solid #e6e6e7;
  background-color: #FFFFFF;
  border-radius: 0.2rem;
  margin-top: 5px;
  margin-bottom: 5px;
  margin-right: 3px;
}

.input-field-container-success {
  border: 1px solid #73ad72;
  background-color: #FFFFFF;
  border-radius: 0.2rem;
  margin-top: 5px;
  margin-bottom: 5px;
  margin-right: 3px;
}

.input-field-container-saving {
  border: 1px solid #fffe8c;
  background-color: #FFFFFF;
  border-radius: 0.2rem;
  margin-top: 5px;
  margin-bottom: 5px;
  margin-right: 3px;
}

.input-field-container-failed {
  border: 1px solid #ff8a8a;
  background-color: #FFFFFF;
  border-radius: 0.2rem;
  margin-top: 5px;
  margin-bottom: 5px;
  margin-right: 3px;
}

.input-field-container-warning {
  border: 1px solid #ff6600;
  background-color: #FFFFFF;
  border-radius: 0.2rem;
  margin-top: 5px;
  margin-bottom: 5px;
  margin-right: 3px;
}

.input-field-container-disabled {
  border: 1px solid #e6e6e7;
  background-color: #ccc;
  border-radius: 0.2rem;
  margin-top: 5px;
  margin-bottom: 5px;
  margin-right: 3px;
}

.list-ios>.item-block:first-child {
  border-top: 0px solid #c8c7cc;
}

.list-ios>.item-block:last-child,
.list-ios>.item-wrapper:last-child .item-block {
  border-bottom: 0px solid #c8c7cc;
}

.item-md.item-block .item-inner {
  border-bottom: 0.5px solid #dedede;
}

.item-ios.item-block .item-inner {
  border-bottom: 0.5px solid #dedede;
}

.table .table-bordered>thead {
  background: #fbfbfb;
  overflow: auto;
}

th {
  font-weight: bold;
}

td,
th {
  padding: 6px;
  border: 1px solid #e6e6e7;
  text-align: center;
  min-height: 2.1rem;
}

.chart-icon {
  width: 30px;
  height: 30px;
  margin: 1px;
}

.chart-icon-container {
  padding: 4px; //border-radius: 20px;
}
